
<template>
  <div class="app">
    <topbar ref="child1"/>
    <div class="jiansuobg">
      <div class="container" style="border-top: 1px solid #F0F2F7;">
        <!-- 搜索条件 -->
        <!-- 固定的一行 -->
        <div class="add1line">
          <div class="jiansuoxiang">检索项</div>
          <div class="addinfo">

            <select v-model="formData.title1" class="select_type">
              <option value="">类别</option>
              <option value="<in/Title>">标题</option>
              <option value="<in/Content>">正文 </option>
              <option value="<in/Author>">作者</option>
              <option value="<in/MagazineName>">期刊</option>
              <option value="<in/Columns>">栏目</option>
            </select>

            <input type="text" v-model="formData.value1" class="input_js">

            <select v-model="formData.qz1" class="select_qz">
              <option value="">权重</option>
              <option value="[1.0]">1</option>
              <option value="[2.0]">2</option>
              <option value="[3.0]">3</option>
              <option value="[4.0]">4</option>
              <option value="[5.0]">5</option>
            </select>
          </div>

          <select v-model="formData.contain2" class="select_operator">
            <!--<option value="">选择</option>-->
            <option value="<and>">并含</option>
            <option value="<or>">或含</option>
            <option value="<not>">不含</option>
          </select>

          <div class="addinfo">

            <select v-model="formData.title2" class="select_type">
              <option value="">类别</option>
              <option value="<in/Title>">标题</option>
              <option value="<in/Content>">正文 </option>
              <option value="<in/Author>">作者</option>
              <option value="<in/MagazineName>">期刊</option>
              <option value="<in/Columns>">栏目</option>
            </select>

            <input type="text" v-model="formData.value2" class="input_js">

            <select v-model="formData.qz2" class="select_qz">
              <option value="">权重</option>
              <option value="[1.0]">1</option>
              <option value="[2.0]">2</option>
              <option value="[3.0]">3</option>
              <option value="[4.0]">4</option>
              <option value="[5.0]">5</option>
            </select>
          </div>
          <div class="plus" @click="addform()">+</div>
          <!--<div class="minus">-</div>-->
        </div>

        <!-- 动态浮动加载 -->
        <div class="add1line"  v-for="(item, index) in formData.more" :key="index">
          <select v-model="item.contain1" class="select_operator">
            <option value="<and>">并含</option>
            <option value="<or>">或含</option>
            <option value="<not>">不含</option>
          </select>
          <div class="addinfo">
            <select v-model="item.title1" class="select_type" >
              <option value="">类别</option>
              <option value="<in/Title>">标题</option>
              <option value="<in/Content>">正文 </option>
              <option value="<in/Author>">作者</option>
              <option value="<in/MagazineName>">期刊</option>
              <option value="<in/Columns>">栏目</option>
            </select>
            <input type="text" v-model="item.value1" class="input_js" placeholder="请选择类别" :disabled="!item.title1">
            <select v-model="item.qz1" class="select_qz">
              <option value="">权重</option>
              <option value="[1.0]">1</option>
              <option value="[2.0]">2</option>
              <option value="[3.0]">3</option>
              <option value="[4.0]">4</option>
              <option value="[5.0]">5</option>
            </select>
          </div>

          <select v-model="item.contain2" class="select_operator">
            <option value="<and>">并含</option>
            <option value="<or>">或含</option>
            <option value="<not>">不含</option>
          </select>

          <div class="addinfo">
            <select v-model="item.title2" class="select_type">
              <option value="">类别</option>
              <option value="<in/Title>">标题</option>
              <option value="<in/Content>">正文 </option>
              <option value="<in/Author>">作者</option>
              <option value="<in/MagazineName>">期刊</option>
              <option value="<in/Columns>">栏目</option>
            </select>
            <input type="text" v-model="item.value2" class="input_js" placeholder="请选择类别" :disabled="!item.title2">
            <select v-model="item.qz2" class="select_qz">
              <option value="">权重</option>
              <option value="[1.0]">1</option>
              <option value="[2.0]">2</option>
              <option value="[3.0]">3</option>
              <option value="[4.0]">4</option>
              <option value="[5.0]">5</option>
            </select>
          </div>
          <div class="plus" @click="addform(index)">+</div>
          <div class="minus"@click="deleteform(index)">-</div>
        </div>

        <div class="jsqkbox">
          <div class="jsbtn hand" @click="searchSub"><img src="../assets/images/jsbtnbg.png" height="18" width="18" > 检索</div>
          <div class="qkbtn hand" @click="empty" >清空</div>
        </div>

        <div class="fenlei">
          <li >
            <div class="left">分类：</div>
            <div class="right">
              <div :class="[ {c1:true}, {newC1:isCat}]">
                <div class="list hand" v-for="items in list_cat1" :class="{choosedcolor:items.isActive}" @click="active_cat1(items)">
                  {{items.name}}
                </div>
                <div class="btn" @click="showCat"></div>
              </div>
              <div class="c2">
                <div class="list hand" v-for="items in list_cat2" :class="{choosedcolor:items.isActive}" @click="active_cat2(items)">
                  {{items.name}}
                </div>
              </div>
            </div>
          </li>
          <!--&lt;!&ndash; 地域分类 &ndash;&gt;-->
          <!--<li style="height:40px;">-->
            <!--<div class="left">地域：</div>-->
            <!--<div class="right">-->
              <!--<div class="c1">-->
                <!--<div class="list hand" v-for="items in list_area" :class="{choosedcolor:items.isActive}" @click="active_area(items)">-->
                  <!--{{items.text}}-->
                <!--</div>-->
              <!--</div>-->

            <!--</div>-->
          <!--</li>-->

          <li style="height:40px;">
            <div class="left">时间：</div>
            <div class="right">
              <div class="c1">
                <div class="list hand" v-for="items in list_time" :class="{choosedcolor:items.isActive}" @click="active_time(items)">
                  {{items.text}}
                </div>
              </div>
            </div>
          </li>
          <li style="height:40px;">
            <div class="left">来源：</div>
            <div class="right">
              <div class="c1" >
                <div class="list hand" v-for="items in list_top_magazine" :class="{choosedcolor:items.isActive}" @click="active_source1(items)">
                  {{items.text}}
                </div>
                <div class="btn" @click="showzimu"></div>
              </div>
              <div class="moresearch" v-show="isMore">
                <div class="zimu">
                  <div class="title">期刊首字母A-Z</div>
                  <div class="zimuarea">
                    <div class="list hand" v-for="items in list_zimu" :class="{choosedblock:items.isActive}" @click="active_zimu(items)">
                      {{items.text}}
                    </div>
                  </div>
                </div>
                <div class="liebiao">
                  <div class="list hand" v-for="items in list_source" :class="{choosedcolor:items.isActive}" @click="active_source(items)">
                    {{items.text}}
                  </div>
                </div>
              </div>

            </div>
          </li>

        </div>



        <div class="gap0"></div>
      </div>
    </div>

    <el-container v-loading="fullscreenLoading"></el-container>
    <div class="container" >
      <div class="Rp bg-ffffff" >
        <!-- 统计条数 -->
        <div class="hmenu">
          <div class="left">搜索结果</div>
          <div class="right">{{totalNum}}条内容</div>
        </div>

        <!-- 收藏循环开始 -->
        <div class="one" v-for="(article,index) in articleInfo">
          <nuxt-link target="_blank" :to="'/article/?collkey='+ article.collkey">
            <div class="title">{{article.title}}</div>
            <img v-if="article.poster.length > 0" v-bind:src="article.poster" alt="">
            <p>&nbsp;&nbsp;&nbsp;&nbsp;{{article.content}}……<span class="readmore">阅读全文</span></p>
          </nuxt-link>
          <div class="zcinfo">
            <span>{{article.magezineName}} {{article.year}}年第{{article.issue}}期 栏目 | {{article.columns}} 文 <span v-show="article.author != null">| {{article.author}}</span></span>
            <span class="zan_down0" @click="zandown(article.collkey,1,index)" v-if="article.isDisagree==0"> </span>
            <span class="zan_down1" @click="zandown(article.collkey,0,index)" v-if="article.isDisagree==1"> </span>
            <span class="zan_up0" @click="zanup(article,1,index)" v-if="article.isAgree==0">赞同 {{article.agreeNum}} </span>
            <span class="zan_up1" @click="zanup(article,0,index)" v-if="article.isAgree==1">已赞同 {{article.agreeNum}} </span>
            <span class="cang0" @click="collect(article,1,index)" v-if="article.isCollect==0">{{article.likeNum}}</span>
            <span class="cang1" @click="collect(article,0,index)" v-if="article.isCollect==1">{{article.likeNum}}</span>
          </div>
        </div>
        <center v-show="showcontent">{{message}}</center>
        <center style="height:200px;margin-top:100px;" v-show="!showcontent">
          <img src="../assets/images/nosearch.png"/>
        </center>
        <!-- 分页 -->
        <div class="pagepart">
          <el-pagination
            @current-change="handleCurrentChange"
            background
            layout="prev, pager, next"
            :current-page="currentPage"
            :page-size="10"
            :total="totalNum">
          </el-pagination>
        </div>

      </div>

    </div>

    <div class="gap100"></div>


    <!--  <Bottombar/> -->
  </div>
</template>

<script>
  import Topbar from '~/components/Topbar.vue'
  import Bottombar from '~/components/Bottombar.vue'
  import axios from 'axios'
  import qs from 'qs'
  export default {
    components: {
      Topbar,
      Bottombar,

    },
    data(){
      return{
        count:1,
        list_magazine:'',
        showcontent:false,
        user:'',
        message:'',
        totalNum:0,
        currentPage:1,
        pageCount:10,
        startDoc:'0',
        fullscreenLoading:false,
        oneLevelData:'',
        twoLevelData:'',
        areaData:'',
        timeData:'',
        originData:'',
        formData: {
          contain1:'<and>',
          title1: '<in/Content>',
          value1: '',
          qz1:'',
          contain2:'<and>',
          title2:'<in/Title>',
          value2:'',
          qz2:'',
          more:[],
        },
        isMore:false,
        isCat:true,
        letter:'',
        data:[],
        articleInfo:[],
        list_area:[
          {text: '亚太', isActive: false},
          {text: '欧洲', isActive: false},
          {text: '美洲', isActive: false},
          {text: '非洲', isActive: false}
        ],
        list_time:[
          {text: '全部', isActive: false},
          {text: '2019年', isActive: false},
          {text: '2018年', isActive: false},
          {text: '2017年', isActive: false},
          {text: '2016年', isActive: false},
          {text: '2015年', isActive: false},
          {text: '2014年', isActive: false},
          {text: '2013年', isActive: false}
        ],
        qzData:[1,2,3,4,5],
        list_top_magazine:[
          {text: '全部', isActive: false},
          {text: '中国新闻周刊', isActive: false},
          {text: '新民周刊', isActive: false},
          {text: '看天下', isActive: false},
          {text: '财经', isActive: false},
          {text: '南风窗', isActive: false},
          {text: '看历史', isActive: false},
          {text: '人物', isActive: false},
          {text: '读者', isActive: false},
          {text: '环球人文地理', isActive: false}
        ],
        list_top_magazine_new:[
          {text: '全部', isActive: false},
          {text: '中国新闻周刊', isActive: false},
          {text: '新民周刊', isActive: false},
          {text: '看天下', isActive: false},
          {text: '财经', isActive: false},
          {text: '南风窗', isActive: false},
          {text: '看历史', isActive: false},
          {text: '人物', isActive: false},
          {text: '读者', isActive: false},
          {text: '环球人文地理', isActive: false}
        ],
        list_source:[],
        list_cat1:[],
        list_cat2:[
          {text: '商业2', isActive: true},
          {text: '财富2', isActive: false},
          {text: '财经2', isActive: false},
          {text: '文化2', isActive: false}
        ],

        list_zimu:[
          {text: 'A', isActive: false},
          {text: 'B', isActive: false},
          {text: 'C', isActive: false},
          {text: 'D', isActive: false},
          {text: 'E', isActive: false},
          {text: 'F', isActive: false},
          {text: 'G', isActive: false},
          {text: 'H', isActive: false},
          {text: 'I', isActive: false},
          {text: 'J', isActive: false},
          {text: 'K', isActive: false},
          {text: 'L', isActive: false},
          {text: 'M', isActive: false},
          {text: 'N', isActive: false},
          {text: 'O', isActive: false},
          {text: 'P', isActive: false},
          {text: 'Q', isActive: false},
          {text: 'R', isActive: false},
          {text: 'S', isActive: false},
          {text: 'T', isActive: false},
          {text: 'U', isActive: false},
          {text: 'V', isActive: false},
          {text: 'W', isActive: false},
          {text: 'X', isActive: false},
          {text: 'Y', isActive: false},
          {text: 'Z', isActive: false},
        ],
        list_zimu_new:[
          {text: 'A', isActive: false},
          {text: 'B', isActive: false},
          {text: 'C', isActive: false},
          {text: 'D', isActive: false},
          {text: 'E', isActive: false},
          {text: 'F', isActive: false},
          {text: 'G', isActive: false},
          {text: 'H', isActive: false},
          {text: 'I', isActive: false},
          {text: 'J', isActive: false},
          {text: 'K', isActive: false},
          {text: 'L', isActive: false},
          {text: 'M', isActive: false},
          {text: 'N', isActive: false},
          {text: 'O', isActive: false},
          {text: 'P', isActive: false},
          {text: 'Q', isActive: false},
          {text: 'R', isActive: false},
          {text: 'S', isActive: false},
          {text: 'T', isActive: false},
          {text: 'U', isActive: false},
          {text: 'V', isActive: false},
          {text: 'W', isActive: false},
          {text: 'X', isActive: false},
          {text: 'Y', isActive: false},
          {text: 'Z', isActive: false},
        ],


      }
    },
    mounted(){
      this.user =  JSON.parse(localStorage.getItem("user"));
      // this.getSessionUser();
      this.getMenuList();
    },
    methods:{
      getSessionUser(){

        let key=localStorage.getItem("user_unique_code");
        if(key!=null && key!="" && key!=undefined){
          console.log("key "+key)
          axios.post('https://wenku.qikan.com:11000/admin/lib/getTokenByUserId.html',qs.stringify({'key':key})
          )
            .then((response)=>{
              console.log("resultuser "+response.data);
              let result= response.data;
              if(result.code==1){
                console.log(result.data.trim())
                this.user=JSON.parse(result.data.trim());
                console.info("usermsg "+this.user)
                // if(this.user!=null && this.user!="" && this.user!=undefined){
                //   // this.poster=this.user.poster;
                //   // console.log("uuaa  "+this.user.mobile)
                //   // this.isLogin=true;
                // }
                this.getMenuList();
              }else{
                this.getMenuList();
              }
            })
            .catch((error)=>{
              console.log(error)
            })
        }else{
          return null;
        }
      },
      empty(){
        this.formData.value1="";
        this.formData.value2="";
        this.formData.title1="<in/Content>";
        this.formData.title2="<in/Title>";
        this.formData.contain1="<and>";
        this.formData.qz1="";
        this.formData.qz2="";

        this.totalNum = 0;
        this.articleInfo = '';
        this.showcontent = false;
        this.list_magazine = '';
        this.list_source = '';
        this.list_zimu = list_zimu_new;
        this.list_top_magazine = list_top_magazine_new;
      },
      collect(rearticle,type,index){
        var vm = this;
        if(this.user!=null && this.user!="" && this.user!=undefined){
          var original = rearticle.magezineName+rearticle.year+'年第'+rearticle.issue+'期';
          axios.get('https://wenku.qikan.com:11000/article/collect?collkey='+rearticle.collkey+"&userCode="+vm.user.unique_code+"&type="+type
            +'&author='+rearticle.author+'&title='+rearticle.title_other+'&original='+original)
            .then(function(res){
              vm.articleInfo[index].isCollect = res.data.data.type;
              vm.articleInfo[index].likeNum = res.data.data.collectNum;
            })
        }else{
          localStorage.setItem("key",vm.collkey);
          var timestamp = Date.parse(new Date())
          localStorage.setItem("failuretime",timestamp+60000);
          localStorage.setItem("jumpurl","/advancesearch")
          this.$refs.child1.godenglu();
        }
      },

      zanup(rearticle,type,index){
        var vm = this;
        if(this.user!=null && this.user!="" && this.user!=undefined){
          var original = rearticle.magezineName+rearticle.year+'年第'+rearticle.issue+'期';
          axios.get('https://wenku.qikan.com:11000/article/agree?collkey='+rearticle.collkey+"&userCode="+vm.user.unique_code+"&type="+type
            +'&author='+rearticle.author+'&title='+rearticle.title_other+'&original='+original)
            .then(function(res){
              console.log(res.data.data);
              vm.articleInfo[index].isAgree = res.data.data.type;
              if(res.data.data.type = 1){
                vm.articleInfo[index].isDisagree = 0;
              }else{
                vm.articleInfo[index].isDisagree = 1;
              }
              // vm.articleInfo.list[index].isAgree = 0;
              vm.articleInfo[index].agreeNum = res.data.data.agreeNum;
            })
        }else {
          localStorage.setItem("key",vm.collkey);
          var timestamp = Date.parse(new Date())
          localStorage.setItem("failuretime",timestamp+60000);
          localStorage.setItem("jumpurl","/advancesearch")
          this.$refs.child1.godenglu();
        }
      },

      zandown(collkey,type,index){
        var vm = this;
        if(this.user!=null && this.user!="" && this.user!=undefined){
          axios.get('https://wenku.qikan.com:11000/article/disagree?collkey='+collkey+"&userCode="+vm.user.unique_code+"&type="+type)
            .then(function(res){
              console.log(res.data.data);
              vm.articleInfo[index].isDisagree = res.data.data.type;
              if(res.data.data.type == 1){
                vm.articleInfo[index].isAgree = 0;
              }
              vm.articleInfo[index].agreeNum = res.data.data.agreeNum;
              // vm.articleInfo.list[index].isAgree = 0;
            })
        }else{
          localStorage.setItem("key",vm.collkey);
          var timestamp = Date.parse(new Date())
          localStorage.setItem("failuretime",timestamp+60000);
          localStorage.setItem("jumpurl","/advancesearch")
          this.$refs.child1.godenglu();
        }
      },
      searchSub(){
        if(this.formData.title1!='' && this.formData.value1!='' ){
          this.getResult();
        }else{
          alert("有未填的内容，请检查");
        }
      },
      handleCurrentChange(val) {
        this.startDoc = val * 10;
        this.currentPage = val;
        this.getResult();
      },
      getResult() {
        var vm = this;
        vm.fullscreenLoading = true;
        vm.keyWord = this.$route.query.key;
        var qs = require('qs');
        axios.post('http://localhost:12000/advance/searchSecond.html',qs.stringify({ 'oneLevelData': vm.oneLevelData ,'twoLevelData':vm.twoLevelData,
          'areaData': vm.areaData,'timeData':vm.timeData,'originData':vm.originData,'startDoc':vm.startDoc,'data':JSON.stringify(vm.formData)}))
          .then(function(res){
            vm.fullscreenLoading = false;
            if(res.data.data!=null){
              if(res.data.data.articleList != null ){
                vm.totalNum = res.data.data.articleList[0].allNum;
                vm.articleInfo = res.data.data.articleList;
                vm.showcontent = true;
                //期刊首拼
                if(res.data.data.magazineName != null){
                  vm.list_zimu = res.data.data.magazineName.firstSpell;
                  vm.list_magazine = res.data.data.magazineName.magazine;
                  vm.list_top_magazine = res.data.data.magazineName.topMagaZine;
                }else{
                  vm.list_magazine = '';
                  vm.list_zimu = list_zimu_new;
                  vm.list_top_magazine = list_top_magazine_new;
                }
                vm.list_source = '';
              }else{
                vm.totalNum = 0;
                vm.message = res.data.message;
                vm.articleInfo = '';
                vm.showcontent = false;
                vm.list_magazine = '';
                vm.list_source = '';
                vm.list_zimu = list_zimu_new;
                vm.list_top_magazine = list_top_magazine_new;
              }
            }else {
              vm.totalNum = 0;
              vm.message = res.data.message;
              vm.articleInfo = '';
              vm.showcontent = false;
              vm.list_magazine = '';
              vm.list_source = '';
              vm.list_zimu = list_zimu_new;
              vm.list_top_magazine = list_top_magazine_new;
            }
          });
        vm.loading = false;
      },

      getMenuList(){
        var vm=this;
        axios.get('https://wenku.qikan.com:11000/index/cate/search')
          .then(function(response){
            console.log(response);
            vm.list_cat1=response.data.data;
          })
      },

      getMagazine(){
        var vm=this;
        axios.get('https://wenku.qikan.com:11000/index/magazine/search?letter='+this.letter)
          .then(function(response){
            console.log(response);
            vm.list_source=response.data.data;
          })
      },

      showzimu(){
        this.isMore=!this.isMore;
      },
      showCat(){
        this.isCat=!this.isCat;
      },


      active_area(e){
        this.list_area.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        // alert(e.text);
      },
      active_time(e){
        if(e.text=='全部'){
          this.timeData = null;
        }else{
          this.timeData = e.text;
        }
        this.list_time.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        this.getResult();
      },
      active_source1(e){
        if(e.text=='全部'){
          this.originData = null;
        }else{
          this.originData = e.text;
        }
        this.list_top_magazine.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        this.getResult();
      },
      active_source(e){
        this.originData = e.text;
        this.list_source.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        this.getResult();
      },
      active_cat1All(e){


      },
      active_cat1(e){
        this.oneLevelData = e.name;
        this.twoLevelData = '';
        this.list_cat2 = e.value;
        this.list_cat1.forEach(function(obj){
          obj.isActive = false;
        });
        this.list_cat2.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        this.getResult();
      },
      active_cat2(e){
        this.twoLevelData = e.name;
        this.list_cat2.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;
        this.getResult();
      },
      active_zimu(e){
        this.letter = e.text;

        this.list_zimu.forEach(function(obj){
          obj.isActive = false;
        });
        e.isActive = !e.isActive;

        if(this.list_magazine == null || this.list_magazine == ''){
          this.getMagazine();
        }else{
          this.list_source = this.list_magazine[e.text];
        }
        console.log(this.list_source);
      },
      addform(index){
        this.count++;
        this.formData.more.push({
          contain1:'<and>',
          title1: '',
          value1: '',
          qz1:'',
          contain2:'<and>',
          title2:'',
          value2:'',
          qz2:'',
        });
        console.log(JSON.stringify(this.formData))
      },
      deleteform(index){
        if(index==this.count-2){
          this.formData.more.splice(index,1);
          this.count=this.count-1
        }
      },
    }
  }
</script>

<style scoped>

  .menuDiv { overflow: hidden;width:270px; background: #fff; padding:0;}
  .menuDiv a {text-decoration: none; color: #225599;width: 270px; height: 36px; line-height: 36px; background:url('../assets/images/arrow-right-blue.png') 250px center no-repeat; background-size: 6px 13px;border-bottom: 1px solid #F0F2F7; font-size: 14px;}
  .menuDiv li, .menuDiv ul{padding: 0;margin:0;list-style: none; width: 270px; }
  .menuDiv > ul > li > ul {display: none;}
  .menuDiv > ul > li:hover ul {display: block;}
  .menuDiv > ul > li > a {display: block; padding-left:10px;}
  .menuDiv > ul > li > ul > li > a {display: block;padding-left:30px; }

  .Rp{width: 850px; display:inline-block;float: left;margin-top:20px;}

  .hmenu{border-bottom:1px solid #F0F2F7; width: 100%; height: 52px; clear: both; padding:0 15px;}
  .hmenu .left{color:#225599; line-height: 50px; height: 50px; width: 64px; margin-right: 43px; display: inline-block; font-weight: 600; border-bottom:3px solid #0084FF;}
  .hmenu .right{display: inline-block; float: right;background: #EFF6FA;border-radius: 3px; height: 30px; padding: 0 10px; line-height: 30px;
    font-size: 14px;color: #678DC1;text-align: center;margin-top:10px;}

  .one{ width: 100%; height: auto;  background-color: #fff; padding: 19px 30px 15px 15px;border-bottom: 3px solid #f2f5f7; }
  .one:hover{ box-shadow:0 0 25px 2px rgba(0,0,0,.2); -moz-box-shadow: 0 0 25px 2px rgba(0, 0, 0, 0.2); -pie-background:rgba(0,0,0,.2);
    -webkit-box-shadow: 0 0 25px 2px rgba(0, 0, 0, 0.2);transition: .3s;z-index: 99999}
  .one .title{font-size: 18px;color: #1A1A1A; line-height: 20px; width: 100%; margin-bottom: 14px; clear: both; font-weight: 600;}
  .one p{font-size: 14px;color: #1A1A1A;text-align: justify;line-height: 24px; max-height: 72px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;}
  .one img{ float: left; margin-right:18px; width: 178px; height: 105px;}

  .info{ width: 100%;  text-align: right;font-size: 12px;color: #8590A6;margin-top: 10px; position: relative;}
  .zan{ border-radius: 3px;  height: 25px; line-height: 25px; padding: 0 5px; padding-left:17px; margin-right:10px;}
  .btn-up{ background:#E8F3FF url('../assets/images/zan-up.png') 6px 5px no-repeat; background-size: 8px 8px; }
  .btn-down{ background:#E8F3FF url('../assets/images/zan-down.png') 6px 5px no-repeat; background-size: 8px 8px;}
  .btn-sc1{width:16px; height: 16px; background: url('../assets/images/icon-shoucang1.png'); background-size: 16px 16px; display: inline-block ;vertical-align: middle;margin-right:4px;margin-left:7px;}
  .btn-sc0{ width:16px; height: 16px; background: url('../assets/images/icon-shoucang0.png'); background-size: 16px 16px; display: inline-block ;vertical-align: middle;margin-right:4px;margin-left:7px;}
  .btn-print{width:16px; height: 16px; background: url('../assets/images/icon-print.png'); background-size: 16px 16px; display: inline-block ;vertical-align: middle;margin-right:4px;margin-left:7px;}
  .btn-share{width:18px; height: 16px; background: url('../assets/images/icon-share.png'); background-size: 18px 16px; display: inline-block ;vertical-align: middle; margin-right:4px; margin-left:7px;}


  .share{ position: relative; }
  .sharelevel{ width: 137px; height: 182px;text-align: left; position: absolute; z-index: 200;top: 32px; left: 0; background: #FCFCFC;border: 1px solid #F2F2F2;box-shadow: 0 2px 4px 0 rgba(181,181,181,0.50);border-radius: 2px; padding: 10px 15px; }
  .sharelevel .list{ width: 100%; height: 40px; line-height: 40px; }

  .icon-copy{width:20px; height: 20px; background: url('../assets/images/share-copy.png'); background-size: 20px 20px; display: inline-block ;vertical-align: middle; margin-right:4px;}
  .icon-qq{width:20px; height: 20px; background: url('../assets/images/share-qq.png'); background-size: 20px 20px; display: inline-block ;vertical-align: middle; margin-right:4px;}
  .icon-weibo{width:20px; height: 20px; background: url('../assets/images/share-weibo.png'); background-size: 20px 20px; display: inline-block ;vertical-align: middle; margin-right:4px;}
  .icon-weixin{width:20px; height: 20px; background: url('../assets/images/share-weixin.png'); background-size: 20px 20px; display: inline-block ;vertical-align: middle; margin-right:4px;}

  .pagepart{ width: 100%; height: 60px; margin: 40px 0;  text-align: center;}
  .zhishibar{ height: 40px; width: 270px;background-image: linear-gradient(-180deg, #1C7DE1 0%, #1674D4 52%, #0866C2 98%, rgba(232,56,41,0.80) 100%);border: 1px solid #0D6EB8;box-shadow: inset 0 1px 0 0 #358BE5;font-size: 14px;
    color: #FFFFFF; line-height: 40px; padding-left: 39px; position: relative; }
  .zhishibar:after{content: ''; background:url('../assets/images/icon-menulist.png') left top no-repeat; background-size: 19px 14px; position: absolute;z-index: 3; left:10px; top:14px; width: 19px; height: 14px;}
  .gap0{ width: 100%; height: 0; clear: both; }

  /* 检索部分 */
  .jiansuobg{ width: 100%; height: auto; background-color: #fff;padding: 1px 0;box-shadow: 0 2px 6px 0 rgba(222,222,222,0.50);  }
  .add1line{ width: 100%; height: 30px; clear: both;margin: 10px 0; color:#698EBF; font-size: 14px; line-height: 30px;}
  .jiansuoxiang{ width: 68px; height: 30px;background:#0084ff;border-radius: 3px;color:#fff; text-align: center; display: inline-block;float: left;margin-right:20px;box-shadow: 1px 1px 3px 0 rgba(84,84,84,0.50);}
  .select_operator{ width: 68px; height: 30px;background:#EFF6FA;border-radius: 3px;border: none;outline: none; padding-left: 10px; display: inline-block;float: left;margin-right:20px;color:#698EBF;box-shadow: 1px 1px 3px 0 rgba(84,84,84,0.50);}
  .select_type{ width: 68px; height: 30px;border: none;outline: none; padding-left: 10px; display: inline-block;float: left;margin-right:20px; border-right:1px solid #e5e5e5;color:#698EBF;background:#f6f6f6;}
  .select_qz{ width: 68px; height: 30px;border: none;outline: none; padding-left: 10px; display: inline-block;float: left;border-left:1px solid #e5e5e5;color:#698EBF;background:#f6f6f6;}
  .input_js{ width: 240px;  height: 30px; line-height: 30px;border: none;outline: none; color:#698EBF;display: inline-block;float: left;background:#f6f6f6;}

  .jsqkbox{width: 100%; height: 100px;border-top:1px dashed #E7EDF5; padding: 30px 0; margin-top:20px;text-align: center;}
  .jsbtn{ width: 152px; height: 38px;line-height: 36px;background: #0D78E7;border: 1px solid #1F83EC;box-shadow: 1px 1px 3px 0 rgba(84,84,84,0.50);border-radius: 8px;font-size: 20px;color: #FFFFFF;text-align: center; display: inline-block;margin-right: 27px;}
  .jsbtn img{ display: inline-block; vertical-align:middle;width: 18px; height: 18px; }
  .qkbtn{ width: 152px; height: 38px;line-height: 36px;background: #EFF6FA;box-shadow: 0 1px 3px 0 rgba(84,84,84,0.50);border-radius: 8px;font-size: 20px;color: #0D78E7;text-align: center; display: inline-block;}
  .addinfo{ width: 396px; height: 30px; display: inline-block;float: left; margin-right: 30px;display: inline-block;float: left; background:#f6f6f6;box-shadow: 1px 1px 3px 0 rgba(84,84,84,0.50);}

  .input_js::-webkit-input-placeholder{font-size: 10px;color: #666;opacity: .4;}
  .input_js:-moz-placeholder{font-size: 10px;color: #666;opacity: .4;}
  .input_js:-ms-input-placeholder{font-size: 10px;color: #666;opacity: .4;}

  .plus,.minus{ width: 30px; height: 30px;text-align: center;margin-right: 10px;display: inline-block;float: left;background:#EFF6FA;box-shadow: 1px 1px 3px 0 rgba(84,84,84,0.50);}
  .minus{margin-right: 0px;}

  /* 分类部分 */
  .fenlei{ width: 100%; height: auto; background: #EFF6FA;margin: 20px auto; }
  .fenlei li    { width: 100%; clear: both; display: block;}
  .fenlei li:after{content:".";display:block;visibility:hidden;height:0;clear:both;}
  .fenlei li .left{ width: 135px;height:100%;line-height: 40px; border-radius: 3px;  text-align: center;font-size: 14px; color:#678DC1; display: inline-block;float: left;}

  .fenlei li .right{width: calc( 100% - 150px ); min-height: 39px;text-align: left;font-size: 14px; color:#678DC1; display: inline-block; float: right;background: #fff;  position: relative; border-bottom: 1px solid #f0f2f7; padding-left: 15px;}
  .fenlei li .right .c1{ width: 100%;height: 40px; clear: both; position: relative; overflow: hidden}
  .fenlei li .right .c1 .btn{ width:30px; height: 30px; line-height: 30px; background: #EFF6FA url('../assets/images/more-arrow.png') center center no-repeat; background-size: 10px 6px; border-radius: 3px; position: absolute;z-index:1000;right: 10px; top:5px; text-align: center; }
  .fenlei li .right .c2{ width: 100%;min-height: 30px; clear: both;text-align: left;line-height: 30px; }
  .fenlei li .right .c1 .list{color:#717171;font-size: 14px; display: inline-block; float: left; line-height: 40px;margin-right: 40px;}
  .fenlei li .right .c2 .list{color:#717171;font-size: 13px; display: inline-block; line-height: 30px; margin-right: 30px;}
  .newC1{ width: 100%; height: 40px; overflow: hidden; }
  .readmore{ display: inline-block;color: #175199 ;font-size: 14px;line-height: 24px; width: 70px;background: url('../assets/images/more-down-arrow.png') right center no-repeat; background-size: 12px 8px;}

  .zcinfo{ width: 100%;  text-align: left;font-size: 12px;margin-top: 10px; position: relative; height: 25px; color:#8590A6;}
  .zan_up0{border-radius: 3px;  height:25px; line-height: 25px; padding: 0 5px; padding-left:17px; margin-right:6px;display: inline-block;background:#E8F3FF url('../assets/images/zan-up.png') 6px 8px no-repeat; background-size: 8px 8px; float: right;color:#0084ff;cursor:pointer;}
  .zan_up1{border-radius: 3px;  height:25px; line-height: 25px; padding: 0 5px; padding-left:17px; margin-right:6px;display: inline-block;background:#0084ff url('../assets/images/zan-up1.png') 6px 8px no-repeat; background-size: 8px 8px; float: right; color:#fff;cursor:pointer;}
  .zan_down0{border-radius: 3px;  height:25px; line-height: 25px; padding: 0 10px; padding-left:17px; margin-right:10px;display: inline-block;background:#E8F3FF url('../assets/images/zan-down.png') 10px 8px no-repeat; background-size: 8px 8px; float: right;color:#0084ff;cursor:pointer;}
  .zan_down1{border-radius: 3px;  height:25px; line-height: 25px; padding: 0 10px; padding-left:17px; margin-right:10px;display: inline-block;background:#0084ff url('../assets/images/zan-down1.png') 10px 8px no-repeat; background-size: 8px 8px; float: right;color:#fff;cursor:pointer;}
  .cang0{  height: 25px;  line-height: 25px; background: url('../assets/images/icon-shoucang0.png') left center no-repeat; background-size: 14px 14px; display: inline-block ;margin-right:10px;margin-left:7px; float: right; padding-left: 20px;color:#8590A6;cursor:pointer;}
  .cang1{  height: 25px; line-height: 25px;  background: url('../assets/images/icon-shoucang1.png') left center no-repeat; background-size: 14px 14px; display: inline-block ;margin-right:10px;margin-left:7px; float: right; padding-left: 20px;color:#0084ff;cursor:pointer;}

  .moresearch{ position: absolute;z-index: 2; left: 0; top: 0; width: 100%; height: 395px;box-shadow: 1px 2px 12px 0 rgba(130,130,130,0.50); background: #fff; }
  .moresearch .zimu{ width: 100%; height: 158px; overflow: hidden;padding-left: 30px;}
  .moresearch .zimu .title{width: 100%; height: 40px; line-height: 40px; color:#717171; font-size: 16px; }
  .moresearch .zimu .zimuarea{ width: 100%; height: 100px; overflow: hidden; }
  .moresearch .zimu .zimuarea .list{display: inline-block; float: left; width: 41px; height: 25px; margin-right: 10px; background: #EFF6FA;color:#0084FF;
    margin-bottom:15px;line-height: 25px; text-align: center;}

  .moresearch .liebiao{ width: 100%; height: 235px; overflow-y: scroll; padding:10px 30px; border-top:1px solid #ddd;}
  .moresearch .liebiao .list{ display: inline-block; float: left; padding-right: 10px; border-right:1px solid #717171; margin-right: 10px; color:#717171;
    margin-bottom:15px;}

  .choosedblock{ background: #0084ff !important;;color: #fff !important;; }
  .choosedcolor{color:#698EBF !important;}

</style>
